// const G6 = require('@antv/g6');
const G6 = require('../../../../../g6/src');
const Util = G6.Util;
const Editor = require('../../../../src/index');
const Simulate = require('event-simulate');
const expect = require('chai').expect;

describe('page mind', () => {
  const container = Util.createDOM(`
    <div>
      <div id="mountNode"></div>
    </div>
  `);
  document.body.appendChild(container);
  const editor = new Editor();
  const page = new Editor.Mind({
    defaultData: {
      roots: [{
        label: '思维导图',
        id: 'root',
        children: [{
          id: 'first-level',
          label: '一级节点'
        }, {
          label: '',
          children: [
            {
              label: '子节点'
            }, {
              label: ''
            }
          ]
        }, {
          label: '一级节点',
          children: [
            {
              label: '子节点'
            }, {
              label: '子节点'
            }
          ]
        }, {
          id: 'long_text',
          label: '这是一个很长的一级节点名称，你要想取个长名字也是可以的，一个词能说清的就不要用句子啦'
        }]
      }]
    },
    graph: {
      container: 'mountNode',
      height: 500,
      fitView: 'cc'
    }
  });
  const graph = page.getGraph();
  const dom = graph.getKeyboardEventWrapper();
  editor.add(page);
  // graph.on('keydown', ev => {
  //   console.log(ev.domEvent);
  // });
  // graph.on('click', ev => {
  //   console.log(ev);
  // });
  it('read', () => {
    expect(page.find('first-level')).not.eql(undefined);
    expect(page.find('root').isSelected).eql(true);
  });
  it('root Tab', () => {
    const ol = graph.getNodes().length;
    Simulate.simulate(dom, 'keydown', {
      keyCode: 9,
      key: 'Tab'
    });
    dom.focus();
    expect(graph.getNodes().length).eql(ol + 1);
    Simulate.simulate(dom, 'keydown', {
      metaKey: true,
      keyCode: 90,
      key: 'z'
    });
    Simulate.simulate(dom, 'keydown', {
      metaKey: true,
      shiftKey: true,
      keyCode: 90,
      key: 'z'
    });
  });
  it('sub Tab', () => {
    const ol = graph.getNodes().length;
    Simulate.simulate(dom, 'keydown', {
      keyCode: 9,
      key: 'Tab'
    });
    dom.focus();
    expect(graph.getNodes().length).eql(ol + 1);
  });
  it('sub Enter', () => {
    const ol = graph.getNodes().length;
    Simulate.simulate(dom, 'keydown', {
      keyCode: 13,
      key: 'Enter'
    });
    dom.focus();
    expect(graph.getNodes().length).eql(ol + 1);
    Simulate.simulate(dom, 'keydown', {
      metaKey: true,
      keyCode: 90,
      key: 'z'
    });
    Simulate.simulate(dom, 'keydown', {
      metaKey: true,
      shiftKey: true,
      keyCode: 90,
      key: 'z'
    });
  });
  it('root Enter', () => {
    page.clearSelected();
    page.setSelected('root', true);
    const ol = graph.getNodes().length;
    Simulate.simulate(dom, 'keydown', {
      keyCode: 13,
      key: 'Enter'
    });
    dom.focus();
    expect(graph.getNodes().length).eql(ol + 1);
  });
  it('ArrowUp', () => {
    const oNth = graph.getNth(page.getSelected()[0]);
    Simulate.simulate(dom, 'keydown', {
      keyCode: 38,
      key: 'ArrowUp'
    });
    const cNth = graph.getNth(page.getSelected()[0]);
    expect(cNth).eql(oNth - 1);
  });
  it('ArrowLeft', () => {
    Simulate.simulate(dom, 'keydown', {
      keyCode: 37,
      key: 'ArrowLeft'
    });
    expect(page.getSelected()[0].id).eql('root');
  });
  it('ArrowRight', () => {
    const root = page.getRoot();
    Simulate.simulate(dom, 'keydown', {
      keyCode: 39,
      key: 'ArrowRight'
    });
    expect(page.getSelected()[0].getModel()).eql(root.children[2]);
  });
  it('ArrowDown', () => {
    const oNth = graph.getNth(page.getSelected()[0]);
    Simulate.simulate(dom, 'keydown', {
      keyCode: 40,
      key: 'ArrowDown'
    });
    const cNth = graph.getNth(page.getSelected()[0]);
    expect(cNth).eql(oNth + 1);
  });
  it('collapsed ctrl/cmd + /', () => {
    Simulate.simulate(dom, 'keydown', {
      keyCode: 38,
      key: 'ArrowUp'
    });
    Simulate.simulate(dom, 'keydown', {
      keyCode: 191,
      key: '/',
      metaKey: true
    });
    expect(page.getSelected()[0].getModel().collapsed).eql(true);
    Simulate.simulate(dom, 'keydown', {
      keyCode: 191,
      key: '/',
      metaKey: true
    });
    expect(page.getSelected()[0].getModel().collapsed).eql(false);
  });
  it('typing', () => {
    Simulate.simulate(dom, 'keydown', {
      keyCode: 65,
      key: 'a'
    });
    dom.focus();
    expect(page.getSelected()[0].getModel().label).eql('a');
  });
  it('move node', () => {
    const node = graph.find('long_text');
    const model = node.getModel();
    let point = graph.getClientPoint(model);
    Simulate.simulate(dom, 'mousedown', {
      clientX: point.x,
      clientY: point.y
    });
    Simulate.simulate(dom, 'mousemove', {
      clientX: point.x + 1,
      clientY: point.y + 3
    });
    point = graph.getClientPoint({
      x: 200,
      y: 197
    });
    Simulate.simulate(dom, 'mousemove', {
      clientX: point.x,
      clientY: point.y
    });
    point = graph.getClientPoint({
      x: -79,
      y: 6
    });
    Simulate.simulate(dom, 'mousemove', {
      clientX: point.x,
      clientY: point.y
    });
    point = graph.getClientPoint({
      x: -25,
      y: 0
    });
    Simulate.simulate(dom, 'mousemove', {
      clientX: point.x,
      clientY: point.y
    });
    point = graph.getClientPoint({
      x: 126,
      y: -160
    });
    Simulate.simulate(dom, 'mousemove', {
      clientX: point.x,
      clientY: point.y
    });
    Simulate.simulate(dom, 'mousemove', {
      clientX: point.x + 1,
      clientY: point.y
    });
    point = graph.getClientPoint({
      x: 236,
      y: -125
    });
    Simulate.simulate(dom, 'mousemove', {
      clientX: point.x,
      clientY: point.y
    });
    Simulate.simulate(dom, 'mousemove', {
      clientX: point.x + 1,
      clientY: point.y
    });
    Simulate.simulate(dom, 'mouseup', {
      clientX: point.x + 1,
      clientY: point.y
    });
    Simulate.simulate(dom, 'keydown', {
      metaKey: true,
      keyCode: 90,
      key: 'z'
    });
    Simulate.simulate(dom, 'keydown', {
      metaKey: true,
      shiftKey: true,
      keyCode: 90,
      key: 'z'
    });
    const nth = graph.getNth(page.getSelected()[0]);
    expect(nth).eql(0);
  });
  it('delete', () => {
    Simulate.simulate(dom, 'keydown', {
      keyCode: 46,
      key: 'Delete'
    });
    expect(graph.find('long_text')).eql(undefined);
    Simulate.simulate(dom, 'keydown', {
      metaKey: true,
      keyCode: 90,
      key: 'z'
    });
    expect(graph.find('long_text')).not.eql(undefined);
  });
  it('vertical move', () => {
    Simulate.simulate(dom, 'keydown', {
      keyCode: 37,
      key: 'ArrowLeft'
    });
    Simulate.simulate(dom, 'keydown', {
      keyCode: 40,
      key: 'ArrowDown'
    });
    Simulate.simulate(dom, 'keydown', {
      keyCode: 39,
      key: 'ArrowRight'
    });
    Simulate.simulate(dom, 'keydown', {
      keyCode: 38,
      key: 'ArrowUp'
    });
    Simulate.simulate(dom, 'keydown', {
      keyCode: 38,
      key: 'ArrowUp'
    });
    expect(page.getSelected()[0].getModel().id).eql('first-level');
  });
  it('debug', () => {
    page.add('node', {
      label: '语雀',
      parent: 'root',
      children: [
        {
          label: '语雀开发者平台（规划中',
          children: [
            {
              label: '价值',
              children: [
                {
                  label: '2B:大幅对接企业内部服务的能力，提高护城河'
                },
                {
                  label: '2C: 生态给用户提供增值服务（小站）'
                }
              ]
            }
          ]
        }
      ]
    });
  });
  it('save', () => {
    page.save();
  });
  it('destroy', () => {
    editor.destroy();
  });
});
